<template>
  <div>
    <el-dialog
      :visible.sync="visible"
      :before-close="handleClose"
      :fullscreen="fullscreen"
       :close-on-click-modal="false"
      width="1200px"
      v-if="visible"
    >
      <div style="height: 760px;">
        <div
          slot="title"
          style="display: flex; justify-content: space-between;align-items: center; "
        >
          <div>选择产品</div>
          <div
            style="margin-right: 30px; cursor: pointer;"
            @click="fullscreen = !fullscreen"
          >
            <img
              style="width: 18px; height: 18px;"
              :src="
                !fullscreen
                  ? require('../../../assets/icon/add.png')
                  : require('../../../assets/icon/fix.png')
              "
              alt=""
            />
          </div>
        </div>
        <div>
          <good-list
            v-if="visible"
            @getStoreItem="getStoreItem"
            :handleNum="handleNum"
            :checked="checked"
          ></good-list>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import goodList from "@/components/goodList/index.vue";
export default {
  name: "GoodListFrom",
  components: { goodList },
  data() {
    return {
      handleNum: "",
      visible: false,
      callback: function() {},
      checked: [],
      fullscreen: false
    };
  },
  methods: {
    handleClose() {
      this.visible = false;
    },
    getStoreItem(img) {
      this.callback(img);
      this.visible = false;
    }
  }
};
</script>

<style scoped>
/deep/ .el-dialog__body {
  padding: 0 20px;
}
</style>
